<template>
	<view>
		<u-popup :show="show1" mode="bottom"  @close="close1" @open="open1" closeable="true" round="5">
			<view style="width: 90%;height: 60vh;margin:0 auto;margin-top:10px; position: relative;">
				<view style="width: 50%;margin:0 auto;height: 50rpx;display: flex;align-items: center;justify-content: center;">
					<text>添加训练次数</text>
				</view>
				<view style="height: 50rpx;display: flex;align-items: center;margin-top: 20px;">
					<text>动作次数:</text>
				</view>
				<view style="height: 100rpx;display: flex;align-items: center;">
					<view style="width: 40%;">
						<u--input v-model="insertForm.actionCount" placeholder="请输入训练次数" type="number"></u--input>
					</view>
					<view style="margin-left: 10px;">次</view>
				</view>
				<view style="height: 50rpx;display: flex;align-items: center;">
					<text>重量:</text>
				</view>
				<view style="height: 100rpx;display: flex;align-items: center;">
					<view style="width: 40%;">
						<u--input v-model="insertForm.equipmentWeight" placeholder="请输入重量" type="number"></u--input>
					</view>
					<view style="margin-left: 10px;">KG</view>
				</view>
				<view style="position: absolute;bottom: 0;width: 100%;box-sizing: border-box;padding: 15px;height: 50px;border-radius: 5px 5px 0 0;">
					<view style="display: flex;align-items: center;float: left;width: 50%;">
						<view style="width: 90%;display: flex;align-items: center;justify-content: center;height: 30px;border-radius: 4px;color: #A3A3A3;background: #F5F5F5;border:1px solid #D4D4D4;" @click="resetting()">
							重置
						</view>
					</view>
					<view style="display: flex;align-items: center;justify-content: flex-end;float: left;width: 50%;">
						<view style="width: 90%;display: flex;align-items: center;justify-content: center;height: 30px;border-radius: 4px;background-color: rgb(60, 156, 255);color: #fff;" @click="insertActionCount()">
							保存
						</view>
					</view>
				</view>
			</view>
		</u-popup>
		<u-popup :show="show2" mode="bottom"  @close="close2" @open="open2" closeable="true" round="5">
			<view style="width: 90%;height: 60vh;margin:0 auto;margin-top:10px; position: relative;">
				<view style="width: 50%;margin:0 auto;height: 50rpx;display: flex;align-items: center;justify-content: center;">
					<text>修改训练次数</text>
				</view>
				<view style="height: 50rpx;display: flex;align-items: center;margin-top: 20px;">
					<text>动作次数:</text>
				</view>
				<view style="height: 100rpx;display: flex;align-items: center;">
					<view style="width: 40%;">
						<u--input v-model="updateForm.actionCount" placeholder="请输入训练次数" type="number"></u--input>
					</view>
					<view style="margin-left: 10px;">次</view>
				</view>
				<view style="height: 50rpx;display: flex;align-items: center;">
					<text>重量:</text>
				</view>
				<view style="height: 100rpx;display: flex;align-items: center;">
					<view style="width: 40%;">
						<u--input v-model="updateForm.equipmentWeight" placeholder="请输入重量" type="number"></u--input>
					</view>
					<view style="margin-left: 10px;">KG</view>
				</view>
				<view style="position: absolute;bottom: 0;width: 100%;box-sizing: border-box;padding: 15px;height: 50px;border-radius: 5px 5px 0 0;">
					<view style="display: flex;align-items: center;float: left;width: 50%;">
						<view style="width: 90%;display: flex;align-items: center;justify-content: center;height: 30px;border-radius: 4px;color: #A3A3A3;background: #F5F5F5;border:1px solid #D4D4D4;" @click="resettingUpdate()">
							重置
						</view>
					</view>
					<view style="display: flex;align-items: center;justify-content: flex-end;float: left;width: 50%;">
						<view style="width: 90%;display: flex;align-items: center;justify-content: center;height: 30px;border-radius: 4px;background-color: rgb(60, 156, 255);color: #fff;" @click="updateActionCount()">
							保存
						</view>
					</view>
				</view>
			</view>
		</u-popup>
		<view style="width: 90%;margin: 0 auto;margin-top: 10rpx;box-shadow: 0 2px 10px #dfdfdf; border-radius: 10px;box-sizing: border-box;padding: 10px;">
			<view style="height: 50rpx;width: 100%;">
				<view style="float: left;width: 50%;">
					<p>{{item.fitnessActionName}}</p>
				</view>
			</view>
			<view v-for="(item, index) in actionData" style="width: 100%;height: 140rpx;margin-top:10px;padding: 10px;background-color: #F7F7F7;">
				<view style="height: 50rpx;width: 100%;">
					<view style="float: left;width:60%">第{{ index+1}}组</view>
				</view>
				<view style="width: 100%;">
					<view style="width: 10%;float: left;margin-top: 10rpx;">
						<u-icon name="calendar" size="36rpx"></u-icon>
					</view>
					<view style="width: 50%;float: left;">
						<view style="margin-top: 10rpx;font-size: 28rpx;">
							<text style="letter-spacing: 5rpx;text-indent: 20rpx;">训练次数: {{item.actionCount}}次</text>
						</view>
						<view style="margin-top: 10rpx;font-size: 28rpx;">
							<text style="letter-spacing: 5rpx;text-indent: 20rpx;">训练重量: {{item.equipmentWeight}}KG</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				item:{},
				actionData:[],
				show1: false,
				show2: false,
				insertForm:{},
				updateForm:{},
				updateFormJSON:''
			}
		},
		onLoad(option) { //option为object类型，会序列化上个页面传递的参数
				
				this.item=JSON.parse(option.item) //打印出上个页面传递的参数。
				this.selectAction()
			},
		methods: {
			open1() {
				// console.log('open');
			},
			close1() {
				this.show1 = false
				// console.log('close');
			},
			open2() {
				// console.log('open');
			},
			close2() {
				this.show2 = false
				// console.log('close');
			},
			openInsert(){
				this.insertForm={}
				this.show1 = true
			},
			openUpdate(item){
				this.updateFormJSON = JSON.stringify(item)
				this.updateForm = JSON.parse(this.updateFormJSON)
				this.show2 = true
			},
			updateActionCount(){
				var ths=this
				uni.request({
					url: this.URL + 'vipPlan/updateActionCount',
					method: 'POST',
					data: {
						id: ths.updateForm.id,
						actionCount:ths.updateForm.actionCount,
						equipmentWeight:ths.updateForm.equipmentWeight,
						planActionId: ths.item.id,
					},
					success: function(res) {
						if(res.data.code == 200){
							ths.updateForm={}
							ths.selectAction()
							ths.show2 = false
						}else{
						}
					},
					fail: function(error) {
						// 处理请求失败
						console.error('角色查询失败,请检查网络');
					}
				})
			},
			resettingUpdate(){
				this.updateForm = JSON.parse(this.updateFormJSON)
			},
			resetting(){
				this.insertForm={}
			},
			insertActionCount(){
				var ths=this
				uni.request({
					url: this.URL + 'vipPlan/insertActionCount',
					method: 'POST',
					data: {
						planActionId: ths.item.id,
						actionCount:ths.insertForm.actionCount,
						equipmentWeight:ths.insertForm.equipmentWeight
					},
					success: function(res) {
						if(res.data.code == 200){
							ths.insertForm={}
							ths.selectAction()
							ths.show1 = false
						}else{
						}
					},
					fail: function(error) {
						// 处理请求失败
						console.error('角色查询失败,请检查网络');
					}
				})
			},
			removeActionCount(item){
				var ths= this
				uni.request({
					url: this.URL + 'vipPlan/removeActionCount',
					method: 'GET',
					data: {
						actionId: item.id,
					},
					// userInfo:res.
					success: function(res) {
						if(res.data.code == 200){
							ths.selectAction()
						}else{
						}
					},
					fail: function(error) {
						// 处理请求失败
						console.error('角色查询失败,请检查网络');
					}
				})
			},
			selectAction(){
				var ths=this
				uni.request({
					url: this.URL + 'vipPlan/selectActionByActionId',
					method: 'GET',
					data: {
						actionId: ths.item.id,
					},
					// userInfo:res.
					success: function(res) {
						if(res.data.code == 200){
							ths.actionData = res.data.data;
						}else{
							ths.actionData = []
						}
					},
					fail: function(error) {
						// 处理请求失败
						console.error('角色查询失败,请检查网络');
					}
				})
			}
		}
	}
</script>

<style>

</style>
